<template>
  <div class="editor-header">
    <!-- 顶部导航 -->
    <div class="editor-header-back" @click="interceptDialog = true;">
      <a-icon type="left" />
    </div>
    <!-- 退出前确认 -->
        <UiConfirm
            title="退出提示"
            v-if="interceptDialog"
            content="确定返回吗？"
            confirmButton="继续编辑"
            closeButton="退出"
            @cancel="backPage"
            @confirm="interceptDialog = false;"
        />
  </div>
</template>

<script>
export default {
  name: 'EditorHeader',
  components: {
    UiConfirm: () => import(/* webpackChunkName: "UiConfirm" */ '../ui-confirm')
  },
  props: {
    msg: String
  },
  data () {
    return {
      interceptDialog: false
    }
  },
  methods: {
    backPage () {
      this.interceptDialog = false
      this.$back()
    }
  }
}
</script>

<style lang="less">
.editor-header {
  background: #000;
  color: rgb(255, 255, 255);
  padding: 1rem 1rem;
  display: flex;
  justify-content: space-between;
}
</style>
